<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title> 资源分配 </title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico">
    <link href="${ctx!}/assets/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${ctx!}/assets/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="${ctx!}/assets/css/animate.css" rel="stylesheet">
    <link href="${ctx!}/assets/css/style.css?v=4.1.0" rel="stylesheet">
    <link href="${ctx!}/assets/css/plugins/zTree/zTreeStyle/zTreeStyle.css" rel="stylesheet">

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>说明</h5>
                </div>
                <div class="ibox-content">
                    <p>为【${role.name}】分配资源</p>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>选择资源</h5>
                </div>
                <div class="ibox-content">
                    <ul id="tree" class="ztree"></ul>
                </div>
            </div>
            <div class="col-sm-6 col-sm-offset-6">
                <button class="btn btn-primary" type="button" id="btnSave">提交</button>
            </div>
        </div>
    </div>

</div>


<!-- 全局js -->

<script src="${ctx!}/assets/js/jquery.min.js?v=2.1.4"></script>
<script src="${ctx!}/assets/js/bootstrap.min.js?v=3.3.6"></script>

<script src="${ctx!}/assets/js/content.js?v=1.0.0"></script>

<script src="${ctx!}/assets/js/plugins/validate/jquery.validate.min.js"></script>
<script src="${ctx!}/assets/js/plugins/validate/messages_zh.min.js"></script>
<script src="${ctx!}/assets/js/plugins/layer/layer.min.js"></script>
<script src="${ctx!}/assets/js/plugins/layer/laydate/laydate.js"></script>
<script src="${ctx!}/assets/js/plugins/zTree/jquery.ztree.all.min.js"></script>

<script type = "text/javascript">
    //权限树设置
    var setting = {
        check: {
            enable: true
        },
        data: {
            simpleData: {
                enable: true
            }
        }
    };

    setting.check.chkboxType = {
        "Y": "ps",
        "N": "s"
    };

    //文档初始化
    $(document).ready(function() {
        //加载资源树（角色权限树）
        $.ajax({
            type : "get",
            url : "${ctx!}/admin/resource/tree/" + ${role.id}, //获取角色的权限树
            dataType : "json",
            success : function(data) { //响应权限列表（ZtreeView集合）
                $.fn.zTree.init($("#tree"), setting, data);
            }
        });

        //提交按钮绑定单击事件
        $("#btnSave").click(function () {
            var treeObj = $.fn.zTree.getZTreeObj("tree");
            var nodes = treeObj.getCheckedNodes(true);
            var selectIds = "";
            for (var index in nodes) {
                if (nodes.hasOwnProperty(index)) { //其实我们知道nodes里面有index属性，该判断可以不需要
                    var item = nodes[index];
                    selectIds += item.id + ","; //获取ZtreeView的id的字符串拼接
                }
            }
            //分配资源
            $.ajax({
                url: "${ctx!}/admin/role/grant/" + ${role.id} + "?t=Math.random()", //给角色分配资源
                type: "post",
                dataType: "json",
                data: {"resourceIds": selectIds}, //请求参数是资源ID集合（以,拼接的字符串，后台可以直接使用数组接收）
                success : function(data) {
                    layer.msg(data.msg, {time: 2000}, function() {
                        //先得到当前iframe层的索引
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index);
                    });
                }
            });
        });
    });
</script>
</body>
</html>
